<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    // this  函数内置的关键词, 指向函数在调用时依存的对象
    // (1)  一般情况下, 普通函数(命名函数,匿名函数)  this默认指向window, 严格模式下 undefined
    // (2)  函数在调用时 属于谁,就指向谁   obj.say()   btn.onclick
    // (3)  箭头函数没有自己的this指向,它的this依赖于箭头函数所在作用域(父作用域的this指向) 简单的来说 箭头函数遇到this就向外跳一层 找父作用域的this指向,如果父作用域也是箭头函数,继续向外跳一层,依次类推,直到全局作用域(this -> window)

    // 改变this指向的方法  call apply  bind 

    // function fn(){
    //     debugger;
    //     console.log(this); // window
    // }
    // fn();

    // setInterval(function(){
    //     console.log(this);   // window
    // },1000);

    // var arr = [1,2,3];
    // arr.forEach(function(){
    //     console.log(this); // window
    // })

    // document.addEventListener("click",function(){
    //     console.log(this);  // document
    // })

    // (2)  函数在调用时 属于谁,就指向谁  
    var zhang = {
        name:"张三",
        age:18,
        say:function(){
            console.log(this);
            console.log(this.name,this.age);
        }
    }

    // zhang.say();  // this -> zhang
    // window.zhang.say();  // this -> zhang

    // var {say} = zhang; // var say = zhang.say;
    // say();  // this -> window

</script>
</html>